<#assign base = request.contextPath />
<!doctype html>
<html style="font-size:50px;" ng-app="app">
<head>
    <meta charset="utf-8">
    <title>幸运大转盘</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, user-scalable=no">
    <meta name="format-detection" content="telephone=no,email=no" />
	<link href="${base}/css/mui.picker.min.css" rel="stylesheet" />
    <link href="${base}/css/mui.poppicker.css" rel="stylesheet" />
    <link href="${base}/css/mui.min.css" rel="stylesheet" />
     <link href="${base}/css/customer.css" rel="stylesheet" />
    <link type="text/css" rel="stylesheet" href="${base}/css/turntable.css" />
    
</head>

<body ng-controller="TurntablCtrl">
		<input type="hidden" id="stid" value="${storeId}"/ >
		<input type="hidden" id="redirecturl" value="${redirecturl}"/ >
    <div class="body">
        <div class="head-body">
            <div class="avatar">
                <img ng-src="{{picurl}}" />
            </div>
            <div class="rotate-body">
                <img id="rotateBody" class="pc" src="${base}/img/test.png" />
                <img id="plateBtn" class="rotate-btn" src="${base}/img/rotate_btn.png" ng-click="luckydraw()" />
                <div class="lucky-list">
                  <div class="lucky-list-inner">
	                    <span class="lucky-item" ng-repeat="prize in prizes">
	                      <span class="name">恭喜:{{decodeURI(prize.mixNick).substring(0,1)}}**** </span>
	                      <span class="prize">抽中{{levelMap[prize.prizeLevel]}}等奖&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
	                    </span>
                  </div>
                </div>
            </div>
        </div>
        <div class="btn-body">
            <div class="btn-border">
                <img src="${base}/img/btn_score.png" />
                <span>会员积分 | {{member.points[0].totalActivePoints || 0}}</span>
            </div>
            <div class="btn-border">
                <img src="${base}/img/btn_prize.png" />
                <span>我的奖品 | <a  href="${base}/prize/${storeId}">点击查询</a></span>
            </div>
        </div>
        <table class="table-btn">
            <tr>
                <td>
                   <div class="btn-border">
                        <img src="${base}/img/btn_score.png" />
                        <span>西门子会员积分 | {{member.points[0].totalActivePoints || 0}}</span>
                    </div>
                </td>
                <td>
                  <div class="btn-border">
                        <img src="${base}/img/btn_prize.png" />
                        <span>我的奖品 | <a href="${base}/prize/${storeId}">点击查询</a></span>
                    </div>
                </td>
            </tr>
        </table>
        <div class="article-body">
            <article>
                <h6>奖品设置</h6>
			             <p>  一等奖：直降4999      &nbsp;&nbsp;&nbsp;共2份</p>
						<p>	二等奖：WMF Diadem PLUS 锅具两件套     &nbsp;&nbsp;&nbsp;  共20套</p>
						<p>	三等奖：弓箭乐美雅八角壶5件套     &nbsp;&nbsp;&nbsp; 共400套 </p>
						<p>	四等奖：优酷会员月卡&nbsp;&nbsp;&nbsp; 共1000张</p>
						<p>	五等奖：100积分</p>
						<p>	六等奖：50积分</p>
                <p class="beizhu" style="padding-top:9pt;color:#b3661c">1.	一等奖适用于中奖后的下一单购买，且金额大于等于4999元，确认收货后5~7个工作日以返现形式给到。<br/>
																													2.	实物奖品发放：中奖后请尽快完善个人信息，我们将默认按此收货信息发放礼品。每月1-15日抽中，15号后7个工作日发货；16-30日抽中，下月7个工作日发货。<br/>
																													3.	优酷会员：将发放至“个人信息”中填写的手机号，并于中奖当月月底统一发放，请注意查收。<br/>
					</p>

                <h6 style="padding-top:16pt;">活动说明</h6>
                <p>活动时间：2017.11.1-2017.12.31</p>
                <p>抽奖条件：每人每天限抽5次,每次抽奖消耗100积分</p>
                <p>*本活动规则如有缺漏，由西门子家电进行补充说明。</p>
            </article>
        </div>
        <footer>
               <a href="${redirecturl}">返回首页</a>
        </footer>
        <div class="alert hide" id="alert">
		  <div class="alert-body">
			<h6>提示</h6>
			<img  src="${base}/img/alert.png" />
			<p style="margin-bottom: 10px;">{{msg}}</p>
			<button id="successAlert">完成</button>
		  </div>
		</div>
		
		<!-- 中奖到流量 --!>
		<div class="alert hide" id="flow" >
		  <div class="alert-body" style="width:5.5rem;height:5rem">
			<h6>填写资料</h6>
			<p style="height: 20px; margin-top: 10px; margin-bottom: 10px;">{{msg}}</p>
			<ul class="user-data">
				<li>
					<span>手机号</span>
					<input style="width:70%" type="text" class="user-data-input" id="mobile" ng-model="member.tel" maxlength="11" placeholder="请输入手机号码"/>
				</li>
			</ul>
			<button ng-click="savePhoneInfo()">完成</button>
		  </div>
		</div>
		
		<!-- 中奖到实物 --!>
		<div class="alert hide" id="materialObject" >
		  <div class="alert-body" style="width:5.5rem;height:8rem">
			<h6>填写资料</h6>
			<p style="height: 20px; margin-top: 10px; margin-bottom: 10px;">{{msg}}</p>
			<ul class="user-data">
				<li>
					<span>手机号</span>
					<input style="width:70%" type="text" class="user-data-input" id="mobile" ng-model="member.tel" maxlength="11" placeholder="请输入手机号码"/>
				</li>
				<li>
					<span>收货人</span>
					<input style="width:70%" type="text" class="user-data-input" id="memberName" ng-model="member.name" maxlength="20" placeholder="姓名"/>
				</li>
				<li>
					<span>收货地址</span>
					<div class="pc form-body">
						<div class="pc" style="margin-top: 5px;border: 1px solid rgba(0,0,0,.2); border-radius: 3px; width: 50px; float: left; line-height: 30px; margin-left: 10px;" class="border-bottom-1px">
							<select  class="three" ng-model="province" ng-options="province.text for province in provinces">
								<option value="0" selected="selected">省</option>
							</select>
						</div>
						<div class="pc" style="margin-top: 5px;border: 1px solid rgba(0,0,0,.2); border-radius: 3px; width: 50px; float: left; line-height: 30px; margin-left: 10px;" class="border-bottom-1px">
							<select class="three" ng-model="city" ng-options="city.text for city in province.children">
								<option value="1" selected="selected">市</option>
							</select>
						</div>
						<div class="pc" style="margin-top: 5px;border: 1px solid rgba(0,0,0,.2); border-radius: 3px; width: 50px; float: left; line-height: 30px; margin-left: 10px;" class="border-bottom-1px">
							<select  class="three" ng-model="district" ng-options="district.text for district in city.children">
								<option value="1" selected="selected">区</option>
							</select>
						</div>
					</div>
					<input style="width:70%" readonly="readonly" type="text"  class="user-data-input mobile" placeholder="请选择省市区" id="picker" ng-model="picker" ng-click="openPickerData()"/>
					<input style="width: 70%; margin-right: 0px; margin-left: 5%; line-height: 30px; float: right; margin-top: 10px; font-size: 17px;" type="text" class="full" placeholder="请输入收货地址（选填）" ng-model="member.address4"/>
				</li>
			</ul>
			<button ng-click="saveInfo()">完成</button>
		  </div>
		</div>
		<div class="alert-error hide">
		  <div class="alert-body">
			<h6>提示</h6>
			<img  src="${base}/img/alert_error.png" />
			<p>{{msg}}</p>
			<button>确定</button>
		  </div>
		</div>
		<script type="text/javascript" src="${base}/js/lib/jquery.min.js"></script>
		<script src="${base}/js/lib/mui.min.js"></script>
		<script type="text/javascript" src="${base}/js/lib/mui.picker.min.js"></script>
	    <script type="text/javascript" src="${base}/js/app/service/date.js"></script>
        <script type="text/javascript" src="${base}/js/lib/jquery.min.js"></script>
        <script type="text/javascript"  src="${base}/js/lib/jquery.rotate.min.js"></script>      
	    <script type="text/javascript" src="${base}/js/lib/angular.min.js"></script>
	    <script type="text/javascript" src="${base}/js/app/app.js"></script>
	    <script type="text/javascript" src="${base}/js/app/service/address.js"></script>
	    <script type="text/javascript" src="${base}/js/app/service/apiService.js"></script>
        <script type="text/javascript" src="${base}/js/app/controller/turntable.js"></script>
        <script type="text/javascript"  src="${base}/js/lib/jquery.rotate.min.js"></script>
        
        <script type="text/javascript">

		$('.tab div').click(function(e){
			if(!$(this).hasClass('select')){
				$('.tab div').removeClass('select');
				$(this).addClass('select')
			}
			$('.profile-body').addClass('hide');
			$('.score-body').addClass('hide');
			$('.record-body').addClass('hide');
			$('.product-body').addClass('hide');

			switch(Number(e.currentTarget.title)){
				case 1: {
					$('.profile-body').removeClass('hide');
					break;
				}
				case 2:{
					$('.score-body').removeClass('hide');
					break;
				}
				case 3:{
					$('.record-body').removeClass('hide');
					break;
				}
				case 4:{
					$('.product-body').removeClass('hide');
					$('.product-body .button-body').removeClass('hide')
					break;
				}
			}
		})
	</script>
    </div>
    
</body>